<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Sopo Visitor Sign-In</title>
    <%= stylesheet_link_tag "kiosk_styles" %>
    <%= javascript_include_tag "jquery-1.3.2.min.js" %>
    <%= javascript_include_tag "jquery.maskedinput-1.2.2.min.js" %>
    <%= javascript_include_tag :defaults %>
  </head>
  <body>
    <div id="volunteer_signin">
      <h1>Volunteers Signin</h1>
      <br />
      <form action="" method="" style="text-align: center">
        Please select your name
        <select id="visitor_id_select" name="visitor_id">
          <% active_volunteers.each do |volunteer| %>
            <%= "<option value='#{volunteer.visitor.id}'>#{volunteer.name}</option>" %>
          <% end %>
        </select>
      </form>
      <br />
      <div class="buttons">
        <a class="button" id="cancel_volunteer_signin" href="#">Cancel</a> <a class="button" id="volunteer_go_signin" href="#" style="">Signin</a>
      </div>
    </div>
    <div class="modal_bg">
    </div>
    <div id="header">
      <div class="logo"></div>
      <div class="title">
        Sopo<br />
        <small>Bicycle Cooperative</small>
      </div>
    </div>
    <div id="right">
      <div id="nest">
        <div class="box">
          <div class="b l"></div>
          <div class="b c"></div>
          <div class="b r"></div>
          <div class="m l"></div>
          <div class="m r"></div>
          <div class="t l"></div>
          <div class="t r"></div>

          <div class="info-blue">
            <br />
            Happening Now:<br />
            <br />
            <% if current_event %>
              <em><%= current_event.name %></em><br />
              <strong> <%= current_event.starts_at.strftime("%A") << " from " << current_event.starts_at.strftime("%I:%M%p") << " - " << current_event.ends_at.strftime("%I:%M%p") %></strong><br />
              <br />
            <% end %>
          </div>
        </div>
      </div>
    </div>
    <div id="left">
      <div id="nest">
        <div class="flash_notice">
          <%= flash[:notice] %>
        </div>
        <%= yield %>
      </div>
    </div>

    <div id="info">
      <%= link_to(image_tag("/images/icons/png-8/24-member-heart.png", :style => "border: 0px; vertical-align: text-bottom;", :title => "Volunteer Signin"), "#", :id => "volunteer_signin_button") %> <%#= Time.now.strftime("%A %I:%M%p")  %> <%=(link_to(image_tag("/images/icons/png-8/24-security-key.png", :title=> "Close Event", :style => "border: 0px; vertical-align:text-bottom;"), event_select_path, :confirm => "Are you sure you want to close this event?")) if current_event %>
    </div>
    
    <div id="footer">
      <div id="privacy" style="display: none;">
        Sopo is dedicated to your privacy policy.  You can view our <a href="#">privacy policy</a> at any time.
      </div>



      <script type="text/javascript">
        jQuery(document).ready(function(){
          jQuery("#visitor_name").focus();

          jQuery("#visitor_submit").click(function(){
            var value = jQuery("#visitor_name").val();
            if (value == "" || value == " " || value == "  "){
              alert("Please enter a name")
              return false;
            }
          })

        });
      </script>
    </div>
  </body>
</html>


